import React from 'react'
import { connect } from 'dva';
import { Icon } from 'react-fa';
import SiderMenu, { formatterData } from '@/components/SiderMenu'

const getMenuRoutes = (...args) => formatterData(...args)

@connect(({ app: { user = {} }}) => ({ user }))
class SimplePanel extends React.Component {
	render() {
		const {
			user: {
				authorities = []
			},
			// match,
			children,
			route: {
				title,
				name,
				routes
			},
			...props
		} = this.props
		const menu = getMenuRoutes(routes, authorities)
		return (
			<div className="x-layout">
				<div className="x-side">
					<div className="x-title">
						<h2><Icon name="flag" />{title || name}</h2>
					</div>
					<div className="x-nav">
						<SiderMenu {...props} menu={menu}></SiderMenu>
					</div>
				</div>
				<div className="x-main">{children}</div>
			</div>
		)
	}
}

export default SimplePanel